<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>注册</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/jiazai.css">
    <style>
        .tit-wrap {
            padding: 10px 20px 0;
            font-size: 16px;
            color: white;
        }
        
        .input-wrap {
            padding: 20px;
            box-sizing: border-box;
        }
        
        .input-wrap>input {
            width: 100%;
            box-sizing: border-box;
            padding: 15px 10px;
            margin-top: 15px;
            font-size: 16px;
            color: white;
            background: #353742;
            border-radius: 5px;
        }
        
        .input-wrap>p:first-of-type {
            padding-top: 15px;
            color: #F25B5B;
            opacity: .7;
        }
        
        .input-wrap>p:last-of-type {
            margin-top: 25px;
            padding: 16px;
            text-align: center;
            font-size: 18px;
            color: white;
            background: #2590FE;
            opacity: .7;
            border-radius: 5px;
        }
        
        .invi-code {
            padding: 15px 10px;
            margin-top: 15px;
            font-size: 16px;
            color: white;
            background: #353742;
            border-radius: 5px;
        }
        
        .invi-code>input {
            flex: 1 1 0;
            width: 100%;
            background: transparent;
            color: white;
        }
        
        .invi-code>span {
            flex: 0 0 80px;
            color: #2590FE;
            font-size: 13px;
            text-align: right;
            opacity: .7;
        }
        
        .agree {
            justify-content: flex-start;
            margin-top: 20px;
            font-size: 14px;
            color: white;
            opacity: .7;
        }
        
        .agree>img {
            margin-right: 5px;
        }
        
        .fixed-bottom {
            position: fixed;
            bottom: 40px;
            left: 0;
            right: 0;
            font-size: 14px;
            color: #2590FE;
            text-align: center;
            opacity: .8;
        }
    </style>
</head>

<body style="background:#2a2c35;">
    <div id='app'>


        <!-- 加载中动画 -->
        <div id='jiazai-ani' v-if='jiazai'>
            <div class="arc"></div>
            <h1><span>LOADING</span></h1>
        </div>
        <!-- 加载中动画 -->

        <div class='tit-wrap dis-spa'>
            <img @click='_close()' src="./img/left.svg" width="22px">
            <div>
                <span>交易密码修改</span>
            </div>
            <span style="opacity:0;">1</span>
        </div>

        <div class='input-wrap'>
            <input type="password" placeholder="请输入原6位数字交易密码" v-model='pas1'>
            <input type="password" placeholder="设置6位数字作为新交易密码" v-model='pas2'>
            <input type="password" placeholder="确认交易密码" v-model='pas3'>
            <p class='dis-spa'>
                <span v-text='notice'>提示：输入密码有误</span>
            </p>
            <p @click='sure'>确认</p>
        </div>
    </div>
    <script src="js/comm.js"></script>
    <script src="js/vue.min.js"></script>
    <script src="js/jquery.min.js"></script>
    <script>
        var app = new Vue({
            el: '#app',
            data: {
                jiazai: false,
                pas1: '',
                pas2: '',
                pas3: '',
                notice: ''
            },
            methods: {

                //设置交易密码
                sure: function() {
                    var This = this;
                    var str = String(parseInt(this.pas2));
                    var strOld = String(parseInt(this.pas1));
                    if (strOld.length != 6 || strOld.length != this.pas1.length) {
                        This.notice = '原密码输入错误';
                        return;
                    }
                    if (str.length != 6 || str.length != this.pas2.length) {
                        This.notice = '请输入6位数字作为交易密码';
                        return;
                    }
                    if (this.pas2 != this.pas3) {
                        This.notice = '两次交易密码不一致';
                        return;
                    }
                    this.jiazai = true;
                    var user = JSON.parse(localStorage.getItem('cc_user'));
                    _post(EDIT_TRANS_PAS, {
                        userid: user.userid,
                        session: user.session,
                        type: 2,
                        ypassword: This.pas1,
                        password1: This.pas2,
                        password2: This.pas3
                    }, function(data) {
                        This.jiazai = false;
                        if (data.status == 1) {
                            _toast('修改交易密码成功');
                            setTimeout(function() {
                                var web = _openHref({
                                    url: 'index.html',
                                    id: 'index',
                                    close: true
                                });
                                setTimeout(function() {
                                    web.evalJS("back()");
                                }, 200);
                            }, 1000);
                        } else {
                            This.notice = data.msg;
                        }
                    });
                }
            }
        });
    </script>
</body>

</html>